import { createContext, useContext } from "react";

const countCotext = createContext();
function App() {
  return (
    <countCotext.Provider value={100}>
      <Foo />
    </countCotext.Provider>
  );
}

function Foo() {
  // 使用useContext简化操作
  const value = useContext(countCotext);
  return <div>我是Foo组件 上层组件传递的值:{value}</div>;

  // 消费Provider提供的数据
  // return (
  //   <countCotext.Consumer>
  //     {(value) => {
  //       return <div>{value}</div>;
  //     }}
  //   </countCotext.Consumer>
  // );
}

export default App;
